$height__chat-header: 150px;
$height__chat-toolbar: 64px;
$height__chat-container: calc(
  100% - #{$height__chat-header - $height__chat-toolbar}
);

mat-toolbar {
  border-bottom: 1px solid #eee;
  .toolbar {
    width: 100%;
  }
  .current-contact {
    .avatar {
      margin: 0 14px 0 10px;
    }
    .name {
      font-size: 18px;
      font-weight: 500;
    }
    .status {
      font-size: 14px;
      color: #888;
    }
  }
}
.chat-contacts-container {
  height: calc(100% - #{$height__chat-toolbar});
  .chat-contacts {
    padding-top: 0;
    .chat-contact {
      position: relative;
      cursor: pointer;
      transition: background 0.1s linear;
      &:hover {
        background: #eee;
      }
      .last-message {
        color: #888;
      }
    }
  }
}
.sidenav-container,
.sidenav-scrollbar-container {
  height: 100%;
}
mat-nav-list {
  height: 630px;
  margin: 0 -24px;
  margin-bottom: -16px;
  background-color: #fbfcfe;
}
